<template>
	<view class="content">
			<!-- 授权客户+产品列表 -->
			<view class="plan" >
				<view class="grace-nowrap grace-flex-vcenter">
					<view class="hd-title"></view>
					<view style="font-size: 34rpx;">授权客户+产品列表</view>
				</view>
				<!-- 列表展示 -->
				<view class="product" >
					<view class="product-content " v-for="item in list" :key="item.id">
						<view class="" v-for="f in fieldList" :key="f">
							<view class="product-title">{{i18n[f] ? i18n[f] : f}}</view>
							<view class="left-margin">
								{{item[f] ? item[f] : '--'}}
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="btn-box">
				<button type="default" @click="save">确定</button>
			</view>
	</view>
</template>

<script>
	import {ajax,getUserInfo} from '@/common/common.js'
	import {bpmUrl} from "@/common/config.js"
	export default {
		data() {
			return {
				list: [],
				fieldList: []
			}
		},
		components: {
		},
		computed: {
			i18n() {
				return this.$t('form')
			}
		},
		onLoad(opt) {
			this.initList()
		},
		methods: {
			initList(){
				let user = getUserInfo()
				let paramas = {
					paramasMap: {
						DocUnid: "86c7fc2808a44047030a1200d273c28ff0ca"
					},
					headersMap: {
						sysid: "bpm",
						syspwd: "pass",
						userid: user.bpmUid
					},
					url: bpmUrl + '/rest/appform/CRMVR/R_CRMVR_B188'
				}
					ajax({
						url:'/bpm/get',
						method: 'POST',
						data: paramas,
						success:res => {
							let list = res.data.rows
							if(list.length > 0){
								this.fieldList = Object.keys(list[0])
							}
							this.list = list
						}
					})
			},
			save(){
				
			}
		}
	}
</script>

<style scoped lang="scss">
	@import "@/common/css/style.css";
	@import "@/common/css/icons.css";
	.grace-nowrap{display:flex; flex-direction:row; flex-wrap:nowrap;}
	.grace-flex-vcenter{align-items:center;}
	.cancel{
		color: #d10000;
		position: absolute;
		top: 10rpx;
		right: 10rpx;
		.icon{
			font-size: 42rpx;
		}
	}
	.hd-title{
		width: 10rpx;height: 30rpx;background-color: #00B26A;margin-right: 5px;
	}
	.product {
		margin-top: 30rpx;
		font-size: 32rpx;
	}
	
	.product-content {
		position: relative;
		width: 100%;
		height: 100%;
		box-sizing: border-box;
		padding: 30rpx;
		margin-bottom: 20rpx;
		border-radius: 10rpx;
		background-color: rgba(0, 167, 60, 0.19);
		line-height: 60rpx;
	}
	
	.product-title {
		font-weight: 500;
	}
	
	.left-margin {
		margin-left: 50rpx;
		color: #C0C0C0;
	}
	
	.content {
		
		font-size: 26rpx;
		font-weight: 500;
	}
	
	.plan {
		padding: 30rpx;
		background-color: #FFFFFF;
	}
	
	.add {
		padding: 20rpx;
	}
	.btn-box{
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
	}
</style>
